<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>超市管理</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
    <script src="assets/js/echarts.min.js"></script>
    <link rel="stylesheet" href="assets/css/amazeui.css"/>
    <link rel="stylesheet" href="assets/css/amazeui.datatables.min.css"/>
    <link rel="stylesheet" href="assets/css/app.css">
    <script src="assets/js/jquery.min.js"></script>


</head>

<body data-type="index">
<script src="assets/js/theme.js"></script>
<div class="am-g tpl-g">
    <!-- 头部 -->
    <header>
        <!-- logo -->
        <div class="am-fl tpl-header-logo">
            <a href="javascript:"><span>正新超市</span></a>
        </div>

        <!-- 右侧内容 -->
        <div class="tpl-header-fluid">
            <!-- 侧边切换 -->
            <div class="am-fl tpl-header-switch-button am-icon-list">
                    <span>

                </span>
            </div>
            <!-- 搜索 -->
            <div class="am-fl tpl-header-search">
                <form class="tpl-header-search-form" action="javascript:">
                    <button class="tpl-header-search-btn am-icon-search"></button>
                    <label>
                        <input class="tpl-header-search-box" type="text" placeholder="搜索内容...">
                    </label>
                </form>
            </div>
            <!-- 其它功能-->
            <div class="am-fr tpl-header-navbar">
                <ul>
                    <!-- 欢迎语 -->
                    <li class="am-text-sm tpl-header-navbar-welcome">
                        <a href="javascript:">欢迎你, <span>店长</span> </a>
                    </li>

                    <!-- 新邮件 -->
                    <li class="am-dropdown tpl-dropdown" data-am-dropdown>
                        <a href="javascript:" class="am-dropdown-toggle tpl-dropdown-toggle" data-am-dropdown-toggle>
                            <i class="am-icon-envelope"></i>
                            <span class="am-badge am-badge-success am-round item-feed-badge">2</span>
                        </a>
                        <!-- 弹出列表 -->
                        <ul class="am-dropdown-content tpl-dropdown-content">
                            <li class="tpl-dropdown-menu-messages">
                                <a href="javascript:" class="tpl-dropdown-menu-messages-item am-cf">
                                    <div class="menu-messages-ico">
                                        <img src="assets/img/user04.png" alt="">
                                    </div>

                                    <div class="menu-messages-content">
                                        <div class="menu-messages-content-title">
                                            <i class="am-icon-circle-o am-text-success"></i>
                                            <span>员工小李</span>
                                        </div>
                                        <div class="am-text-truncate"> 申请假期
                                        </div>
                                        <div class="menu-messages-content-time">2020-06-06 下午 16:40</div>
                                    </div>
                                </a>
                            </li>

                            <li class="tpl-dropdown-menu-messages">
                                <a href="javascript:" class="tpl-dropdown-menu-messages-item am-cf">
                                    <div class="menu-messages-ico">
                                        <img src="assets/img/user02.png" alt="">
                                    </div>

                                    <div class="menu-messages-content">
                                        <div class="menu-messages-content-title">
                                            <i class="am-icon-circle-o am-text-warning"></i>
                                            <span>员工小张</span>
                                        </div>
                                        <div class="am-text-truncate"> 申请涨工资</div>
                                        <div class="menu-messages-content-time">2020-06-06 上午 09:23</div>
                                    </div>
                                </a>
                            </li>
                            <li class="tpl-dropdown-menu-messages">
                                <a href="javascript:" class="tpl-dropdown-menu-messages-item am-cf">
                                    <i class="am-icon-circle-o"></i> 进入列表…
                                </a>
                            </li>
                        </ul>
                    </li>


                    <!-- 退出 -->
                    <li class="am-text-sm">
                        <a href="javascript:">
                            <span class="am-icon-sign-out"></span> 退出
                        </a>
                    </li>
                </ul>
            </div>
        </div>

    </header>
    <!-- 风格切换 -->
    <div class="tpl-skiner">
        <div class="tpl-skiner-toggle am-icon-cog">
        </div>
        <div class="tpl-skiner-content">
            <div class="tpl-skiner-content-title">
                选择主题
            </div>
            <div class="tpl-skiner-content-bar">
                <span class="skiner-color skiner-white" data-color="theme-white"></span>
                <span class="skiner-color skiner-black" data-color="theme-black"></span>
            </div>
        </div>
    </div>
    <!-- 侧边导航栏 -->
    <div class="left-sidebar">
        <!-- 用户信息 -->
        <div class="tpl-sidebar-user-panel">
            <div class="tpl-user-panel-slide-toggleable">
                <div class="tpl-user-panel-profile-picture">
                    <img src="assets/img/user08.jpeg" alt="">
                </div>
                <span class="user-panel-logged-in-text">
              <i class="am-icon-circle-o am-text-success tpl-user-panel-status-icon"></i>
              店长
          </span>
                <a href="javascript:" class="tpl-user-panel-action-link"> <span class="am-icon-pencil"></span> 账号设置</a>
            </div>
        </div>

        <!-- 菜单 -->
        <ul class="sidebar-nav">

            <li class="sidebar-nav-link">
                <a href="index.html" class="active">
                    <i class="am-icon-home sidebar-nav-link-logo"></i> 首页
                </a>
            </li>
            <li class="sidebar-nav-link">
                <a href="goods.html">
                    <i class="am-icon-table sidebar-nav-link-logo"></i> 货架管理
                </a>
            </li>
            <li class="sidebar-nav-link">
                <a href="repository.html">
                    <i class="am-icon-calendar sidebar-nav-link-logo"></i> 仓库管理
                </a>
            </li>
            <li class="sidebar-nav-link">
                <a href="staff.html">
                    <i class="am-icon-wpforms sidebar-nav-link-logo"></i> 员工管理

                </a>
            </li>
            <li class="sidebar-nav-link">
                <a href="suppliers.html">
                    <i class="am-icon-bar-chart sidebar-nav-link-logo"></i> 供货商管理

                </a>
            </li>


            <li class="sidebar-nav-link">
                <a href="sign-up.html">
                    <i class="am-icon-clone sidebar-nav-link-logo"></i> 注册
                    <span class="am-badge am-badge-secondary sidebar-nav-link-logo-ico am-round am-fr am-margin-right-sm">6</span>
                </a>
            </li>
            <li class="sidebar-nav-link">
                <a href="login.html">
                    <i class="am-icon-key sidebar-nav-link-logo"></i> 登录
                </a>
            </li>


        </ul>
    </div>


    <!-- 内容区域 -->
    <div class="tpl-content-wrapper">


        <div class="row-content am-cf">
            <div class="row  am-cf">
                <div class="am-u-sm-12 am-u-md-12 am-u-lg-4">
                    <div class="widget am-cf">
                        <div class="widget-head am-cf">
                            <div class="widget-title am-fl">月度财务收支计划</div>
                            <div class="widget-function am-fr">
                                <a href="javascript:" class="am-icon-cog"></a>
                            </div>
                        </div>
                        <div class="widget-body am-fr">
                            <div class="am-fl">
                                <div class="widget-fluctuation-period-text">
                                    财务总额￥61746.45
                                    <button class="widget-fluctuation-tpl-btn">
                                        <i class="am-icon-calendar"></i>
                                        更多月份
                                    </button>
                                </div>
                            </div>
                            <div class="am-fr am-cf">
                                <div class="widget-fluctuation-description-amount text-success am-cf">
                                    +￥30420.56

                                </div>
                                <div class="widget-fluctuation-description-text am-text-right">
                                    6月份收入
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="am-u-sm-12 am-u-md-6 am-u-lg-4">
                    <div class="widget widget-primary am-cf">
                        <div class="widget-statistic-header">
                            本季度利润
                        </div>
                        <div class="widget-statistic-body">
                            <div class="widget-statistic-value">
                                ￥27,294
                            </div>
                            <div class="widget-statistic-description">
                                本季度比去年多收入 <strong>2593元</strong> 人民币
                            </div>
                            <span class="widget-statistic-icon am-icon-credit-card-alt"></span>
                        </div>
                    </div>
                </div>
                <div class="am-u-sm-12 am-u-md-6 am-u-lg-4">
                    <div class="widget widget-purple am-cf">
                        <div class="widget-statistic-header">
                            自2020年1月1日以来利润
                        </div>
                        <div class="widget-statistic-body">
                            <div class="widget-statistic-value">
                                ￥2,237,294
                            </div>
                            <div class="widget-statistic-description">
                                本季度比去年多收入 <strong>2593元</strong> 人民币
                            </div>
                            <span class="widget-statistic-icon am-icon-support"></span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row am-cf">
                <div class="am-u-sm-12 am-u-md-8 am-u-lg-8">
                    <div class="widget am-cf">
                        <div class="widget-head am-cf">
                            <div class="widget-title am-fl">月度销售额</div>
                            <div class="widget-title-sm am-fl">(每天00:00更新)</div>

                        </div>
                        <div class="widget-body-lg widget-body tpl-amendment-echarts am-fr" id="tpl-echarts">

                        </div>
                    </div>
                </div>
                <div class="am-u-sm-12 am-u-md-4">
                    <div class="widget am-cf">
                        <div class="widget-head am-cf">
                            <div class="widget-title am-fl">销售占比</div>
                        </div>
                        <div class="widget-body-lg widget-body tpl-amendment-echarts am-fr" id="saleP-echarts">

                        </div>
                    </div>
                </div>

            </div>
            <div class="row">
                <div class="am-u-sm-12 am-u-md-12">
                    <div class="widget am-cf">
                        <div class="widget-head am-cf">
                            <div class="widget-title am-fl">库存报警</div>
                            <div class="widget-function am-fr">
                                <a href="javascript:;" class="am-icon-cog"></a>
                            </div>
                        </div>
                        <div class="widget-body  widget-body-lg am-fr">

                            <table width="100%" class="am-table am-table-compact tpl-table-black " id="example-r">
                                <thead>
                                <tr>
                                    <th>商品名称</th>
                                    <th>货架数量</th>
                                    <th>库存</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr class="gradeX">
                                    <td class="text-red">恰恰山药脆皮</td>
                                    <td class="text-red">2</td>
                                    <td class="text-red">13</td>
                                    <td>
                                        <div class="tpl-table-black-operation">
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-cart-plus"></i> 上架
                                            </a>
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-truck"></i> 补货
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="even gradeC">
                                    <td class="text-red">牛奶巧克力豆</td>
                                    <td class="text-red">3</td>
                                    <td>999</td>
                                    <td>
                                        <div class="tpl-table-black-operation">
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-cart-plus"></i> 上架
                                            </a>
                                            <a href="javascript:;">
                                                <i class="am-icon-truck"></i> 补货
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="gradeX">
                                    <td class="text-red">旺旺仙贝</td>
                                    <td class="text-red">50</td>
                                    <td class="text-red">24</td>
                                    <td>
                                        <div class="tpl-table-black-operation">
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-cart-plus"></i> 上架
                                            </a>
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-truck"></i> 补货
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="even gradeC">
                                    <td class="text-red">土豆</td>
                                    <td class="text-red">30</td>
                                    <td>2999</td>
                                    <td>
                                        <div class="tpl-table-black-operation">
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-cart-plus"></i> 上架
                                            </a>
                                            <a href="javascript:;">
                                                <i class="am-icon-truck"></i> 补货
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="even gradeC">
                                    <td class="text-red">进口红提</td>
                                    <td class="text-red">10</td>
                                    <td class="text-red">22</td>
                                    <td>
                                        <div class="tpl-table-black-operation">
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-cart-plus"></i> 上架
                                            </a>
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-truck"></i> 补货
                                            </a>
                                        </div>
                                    </td>
                                </tr>

                                <tr class="even gradeC">
                                    <td class="text-red">红西柚</td>
                                    <td class="text-red">54</td>
                                    <td>300</td>
                                    <td>
                                        <div class="tpl-table-black-operation">
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-cart-plus"></i> 上架
                                            </a>
                                            <a href="javascript:;" class="tpl-table-black-operation-del">
                                                <i class="am-icon-truck"></i> 补货
                                            </a>
                                        </div>
                                    </td>
                                </tr>

                                </tbody>
                            </table>

                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="am-u-sm-12 am-u-md-12">
                    <div class="widget am-cf">
                        <div class="widget-head am-cf">
                            <div class="widget-title am-fl">请假快处</div>
                            <div class="widget-function am-fr">
                                <a href="javascript:;" class="am-icon-cog"></a>
                            </div>
                        </div>
                        <div class="widget-body  widget-body-lg am-fr">
                            <div class="am-u-sm-12">
                                <table width="100%" class="am-table am-table-compact am-table-striped tpl-table-black ">
                                    <thead>
                                    <tr>
                                        <th>员工照片</th>
                                        <th>姓名</th>
                                        <th>负责区域</th>
                                        <th>职务</th>
                                        <th>请假理由</th>
                                        <th>操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr class="gradeX">
                                        <td>
                                            <img src="assets/img/avatar-1.jpg" class="tpl-table-line-img" alt="">
                                        </td>
                                        <td class="am-text-middle">张三</td>
                                        <td class="am-text-middle">食品区</td>
                                        <td class="am-text-middle">导购</td>
                                        <td class="am-text-middle">头疼</td>
                                        <td class="am-text-middle">
                                            <div class="tpl-table-black-operation">
                                                <a href="javascript:;">
                                                    <i class="am-icon-check"></i> 准假
                                                </a>
                                                <a href="javascript:;" class="tpl-table-black-operation-del">
                                                    <i class="am-icon-remove"></i> 驳回
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr class="even gradeC">
                                        <td>
                                            <img src="assets/img/avatar-2.jpg" class="tpl-table-line-img" alt="">
                                        </td>
                                        <td class="am-text-middle">李四</td>
                                        <td class="am-text-middle">肉蛋奶区</td>
                                        <td class="am-text-middle">区域经理</td>
                                        <td class="am-text-middle">脑热</td>
                                        <td class="am-text-middle">
                                            <div class="tpl-table-black-operation">
                                                <a href="javascript:;">
                                                    <i class="am-icon-check"></i> 准假
                                                </a>
                                                <a href="javascript:;" class="tpl-table-black-operation-del">
                                                    <i class="am-icon-remove"></i> 驳回
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr class="gradeX">
                                        <td>
                                            <img src="assets/img/avatar-3.jpg" class="tpl-table-line-img" alt="">
                                        </td>
                                        <td class="am-text-middle">王二麻子</td>
                                        <td class="am-text-middle">零食区</td>
                                        <td class="am-text-middle">导购</td>
                                        <td class="am-text-middle">脖子抽筋</td>
                                        <td class="am-text-middle">
                                            <div class="tpl-table-black-operation">
                                                <a href="javascript:;">
                                                    <i class="am-icon-check"></i> 准假
                                                </a>
                                                <a href="javascript:;" class="tpl-table-black-operation-del">
                                                    <i class="am-icon-remove"></i> 驳回
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr class="even gradeC">
                                        <td>
                                            <img src="assets/img/ju.jpg" class="tpl-table-line-img" alt="">
                                        </td>
                                        <td class="am-text-middle">鞠婧祎</td>
                                        <td class="am-text-middle">宣传部</td>
                                        <td class="am-text-middle">代言人</td>
                                        <td class="am-text-middle">外出找灵感</td>
                                        <td class="am-text-middle">
                                            <div class="tpl-table-black-operation">
                                                <a href="javascript:;">
                                                    <i class="am-icon-check"></i> 准假
                                                </a>
                                                <a href="javascript:;" class="tpl-table-black-operation-del">
                                                    <i class="am-icon-remove"></i> 驳回
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr class="even gradeC">
                                        <td>
                                            <img src="assets/img/su.jpg" class="tpl-table-line-img" alt="">
                                        </td>
                                        <td class="am-text-middle">舒畅</td>
                                        <td class="am-text-middle">宣传部</td>
                                        <td class="am-text-middle">宣传部部长</td>
                                        <td class="am-text-middle">外出学习</td>
                                        <td class="am-text-middle">
                                            <div class="tpl-table-black-operation">
                                                <a href="javascript:;">
                                                    <i class="am-icon-check"></i> 准假
                                                </a>
                                                <a href="javascript:;" class="tpl-table-black-operation-del">
                                                    <i class="am-icon-remove"></i> 驳回
                                                </a>
                                            </div>
                                        </td>
                                    </tr>

                                    <tr class="even gradeC">
                                        <td>
                                            <img src="assets/img/pdd.jpg" class="tpl-table-line-img" alt="">
                                        </td>
                                        <td class="am-text-middle">PDD</td>
                                        <td class="am-text-middle">股东会</td>
                                        <td class="am-text-middle">股东</td>
                                        <td class="am-text-middle">外出打比赛</td>
                                        <td class="am-text-middle">
                                            <div class="tpl-table-black-operation">
                                                <a href="javascript:;">
                                                    <i class="am-icon-check"></i> 准假
                                                </a>
                                                <a href="javascript:;" class="tpl-table-black-operation-del">
                                                    <i class="am-icon-remove"></i> 驳回
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                    <!-- more data -->
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <script src="assets/js/amazeui.min.js"></script>
    <script src="assets/js/amazeui.datatables.min.js"></script>
    <script src="assets/js/dataTables.responsive.min.js"></script>
    <script src="assets/js/app.js"></script>
    <script src="assets/js/index.js"></script>
</body>

</html>